<template>
  <div>
    <el-descriptions  title="基本信息" :column="3" size="small">
    <template slot="extra"  v-if="canModify">
      <el-button type="primary" size="small" @click.native="editBase">编 辑</el-button>
    </template>
       <el-descriptions-item label="退货单号">{{ returnOrderInfo.returnNo||'--' }}</el-descriptions-item>
       <el-descriptions-item :label="returnOrderOption.relationNameKey">
         <el-tag size="small">{{ returnOrderInfo.relationName||'--' }}</el-tag>
         </el-descriptions-item>
       <el-descriptions-item label="负责人">{{ returnOrderInfo.chargePersonName||'--' }}</el-descriptions-item>

       <el-descriptions-item :label="returnOrderOption.orderTypeLableKey+'订单'">{{ returnOrderInfo.relationOrderNo||'--' }}</el-descriptions-item>
       <el-descriptions-item label="退货类型">{{ returnOrderInfo.returnTypeName||'--' }}</el-descriptions-item>
       <el-descriptions-item label="退货金额">{{ returnOrderInfo.returnTotalAmount||'--' }}</el-descriptions-item>

       <el-descriptions-item label="商定退货日期">{{ returnOrderInfo.returnDate | FormatDate('yyyy-MM-dd') ||'--'}}</el-descriptions-item>
       <el-descriptions-item label="完成日期">{{ returnOrderInfo.returnCompletionDate | FormatDate('yyyy-MM-dd')||'--' }}</el-descriptions-item>
       <el-descriptions-item v-if="returnOrderInfo.status===-1" label="取消原因">{{ returnOrderInfo.failureReason||'--'}}</el-descriptions-item>
       <el-descriptions-item label="备注">{{ returnOrderInfo.remark ||'--'}}</el-descriptions-item>
  </el-descriptions>
    <el-descriptions  title="退货地址" :column="3" size="small">
    <template slot="extra" v-if="canModify">
      <el-button type="primary" size="small" @click.native="eidtAds">编 辑</el-button>
    </template>
       <el-descriptions-item label="联系人">{{ returnOrderInfo.returnContractsName||'--' }}</el-descriptions-item>
       <el-descriptions-item label="联系人手机">{{ returnOrderInfo.returnContractsMobile||'--' }}</el-descriptions-item>
       <el-descriptions-item label="联系人邮箱">{{ returnOrderInfo.returnContractsEmail ||'--' }}</el-descriptions-item>
       <el-descriptions-item label="联系地址">{{ returnOrderInfo.returnAddress || '--' }}</el-descriptions-item>
  </el-descriptions>
  <el-descriptions  title="系统信息" :column="2" size="small">
       <el-descriptions-item label="创建人">{{ returnOrderInfo.creatorName||'--' }}</el-descriptions-item>
       <el-descriptions-item label="创建时间">{{ returnOrderInfo.createTime || '--' }}</el-descriptions-item>
       <el-descriptions-item label="最后更新人">{{ returnOrderInfo.updaterName||'--' }}</el-descriptions-item>
       <el-descriptions-item label="更新时间">{{ returnOrderInfo.updateTime ||'--' }}</el-descriptions-item>
  </el-descriptions>
         <Order-base  :visible.sync="visibleBase" :param="returnOrderInfo" @saveAfter="editAfter"/>
         <Order-returnads  :visible.sync="visibleAds" :param="returnOrderInfo"  @saveAfter="editAfter"/>
  </div>
</template>
<script>
import returnOrder from '@/api/eims/returnOrderAPI'
import OrderBase from './edit/order_base'
import OrderReturnads from './edit/order_returnads'
export default {
  props: {
    type: String,
    param: Object
  },
  components: {OrderBase, OrderReturnads},
  computed: {
    returnOrderOption () {
      const option = {}
      if (this.type === 'purchaseOrder') {
        option.orderTypeLableKey = '采购'
        option.relationNameKey = '经销商'
      } else {
        option.orderTypeLableKey = '销售'
        option.relationNameKey = '客户'
      }
      return option
    }
  },
  watch: {
    param: {
      handler (val) {
        this.canModify = val.status === 0 || val.status === 2
        this.returnOrderInfo = {...val}
      },
      deep: true,
      immediate: true
    }
  },
  data () {
    return {
      returnOrderInfo: {},
      canModify: false,
      visibleBase: false,
      visibleAds: false
    }
  },
  created () {
    this.getReturnOrderInfo(this.param.returnNo)
  },
  methods: {
    editBase () {
      this.visibleBase = true
    },
    eidtAds () {
      this.visibleAds = true
    },
    editAfter (returnNo) {
      this.getReturnOrderInfo(returnNo)
      this.$emit('editAfter', returnNo)
    },
    getReturnOrderInfo (returnNo) {
      returnOrder.getReturnOrderAPI(returnNo).then(res => {
        this.returnOrderInfo = res.data || {}
        this.$emit('update:param', this.returnOrderInfo)
      })
    }
  }
}
</script>

<style lang="scss" scoped>
</style>
